/* React Starter Kit | MIT License | http://www.reactstarterkit.com/ */

:root {

  /*
   * Colors
   * ======================================================================== */

  --white-base:            hsl(255, 255, 255);
  --gray-darker:           color(black lightness(+13.5%)); /* #222 */
  --gray-dark:             color(black lightness(+25%));   /* #404040 */
  --gray:                  color(black lightness(+33.5%)); /* #555 */
  --gray-light:            color(black lightness(+46.7%)); /* #777 */
  --gray-lighter:          color(black lightness(+93.5%)); /* #eee */

  /*
   * Typography
   * ======================================================================== */

  /*
   * 字体相关知识: http://www.ruanyifeng.com/blog/2014/07/chinese_fonts.html
   */
  --font-family-base:      'Hiragino Sans GB', "华文细黑", "微软雅黑", 'Segoe UI', 'HelveticaNeue-Light', sans-serif;

  /*
   * Layout
   * ======================================================================== */

  --max-content-width:     1000px;

  /*
   * Media queries breakpoints
   * ======================================================================== */

  --screen-xs-min:         480px;  /* Extra small screen / phone */
  --screen-sm-min:         768px;  /* Small screen / tablet */
  --screen-md-min:         992px;  /* Medium screen / desktop */
  --screen-lg-min:         1200px; /* Large screen / wide desktop */

  /*
   * Animations
   * ======================================================================== */

  --animation-swift-out:   .45s cubic-bezier(0.3, 1, 0.4, 1) 0s;

}
